<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <!-- 引入自定义的promise -->
  <script src="./Promise.js"></script>
  <script>

    /* 
   promise对象内部要存储哪些信息?
     1. 状态: pending/fulfilled/rejected  ==> 用state表示
     2. 结果数据: undefined/value/reason  ==> data  
     3. 保存待处理回调的数组: [{resolved () {}, rejected () {}}, {resolved () {}, rejected () {}}] => callbacks
  
     在构造函数中, 会立即同步调用执行器函数, 并传入resolv   e和reject 两个函数

     resolve函数
       参数: value
       作用: 将promise的状态改为resolved, 将value保存到data
     reject函数
       参数: reason
       作用: 将promise的状态改为rejected, 将reason保存到data
   */ 

    // 现在用的就是自定义的promise
    const p = new Promise((resolve, reject) => {
      // resolve(1)
      // reject(2)
      setTimeout(()=>{
        // resolve(3)
        reject(4)
      },1000)
    })
    // console.log(p);
    p.then(
      value => {
        console.log('onResovled1', value)
      },
      reason => {
        console.log('onRejected1', reason)
        
        // 返回promise
        // return new Promise((resolve, reject) => {
        //   // resolve(2)
        //   // reject(3)
        // })

        // 返回非Promse
        // return 4

        // 抛出错误
        // throw 5
      }
    )
    p.then(
      value => {
        console.log('onResovled2', value)
      },
      reason => {
        console.log('onRejected2', reason)
      }
    )
    // .then(
    //   value =>{
    //     console.log('onResovled3', value);
    //   },
    //   reason =>{
    //     // console.log('onRejected3', reason)
    //     throw 6
    //     // return 6
    //   }
    // )
    // .catch(
    //   reason => {
    //     console.log('onRejected4', reason)
    //   }
    // )
    // // .then(
    // //   value => {
    // //     console.log('onResovled5', value)
    // //   },
    // //   reason => {
    // //     console.log('onRejected5', reason)
    // //   }
    // // )

    /* 
    对象快照: 输出当时, 对象的样子(对象的数据) => 显示在外层是快照
    后面对象内部的数据可能会发生变化  ==> 打开显示的此时对象的数据
    */
    var obj = {m:1}
    console.log(obj); // {m :1}
    setTimeout(()=>{
      obj.m = 2
    },1000)



  </script>
</body>

</html>